import React, { useEffect, useState } from 'react';
import DescriptionsCondition from '@/components/DescriptionsCondition';
import DrawerCondition from '@/components/DrawerCondition';
import PopImgShow from '@/components/PopImgShow';
import TableDataBlock from '@/components/TableDataBlock';
import { connect } from 'umi';
import { Space, Tag, InputNumber } from 'antd'
import { order_status, goodsType_status } from '@/common/contact';
const PointDetail = (props) => {
  const { dispatch, show, list = [], onClose, handleCallback, orderInfo = {}, loading } = props;
  const [tableList, setTableList] = useState([])
  useEffect(() => {
    setTableList(list)
  }, [list])
  useEffect(() => {
    if (!show) {
      setTableList([])
    }
  }, [show])
  const onChangeTable = (e, id) => {
    setTableList(tableList.map(item => {
      if (item.id === id) {
        return {
          ...item,
          ...e
        }
      }
      return item
    }))
  }
  const { orderSn } = orderInfo
  const btnExtra = [
    {
      text: '分配',
      loading: loading,
      onClick: () => {
        fetchRoleEdit()
      },
    },
  ];

  const fetchRoleEdit = () => {
    const uploadList =
      dispatch({
        type: 'commission/fakeConfirmDistribute',
        payload: {
          orderSn, status: '1', distributeCommissionItemSnapshotList: tableList.map(item => {
            return {
              id: item.id,
              commissionFee: item.commissionFee,
              performance: item.performance
            }
          })
        },
        callback: () => {
          onClose();
          handleCallback();
        },
      });
  };
  const getColumns = [
    // {
    //   title: '订单编号',
    //   dataIndex: 'orderSn',
    // },
       {
      title: '阶段',
      dataIndex: 'stageInfo',
      render: (e = {}) => {
        const { stageName } = e
        return stageName || '--'
      }
    },
    {
      title: '阶段描述',
      dataIndex: 'stageDesc',
    },
    {
      title: '分佣比例(%)',
      dataIndex: 'percentage',
    },
    {
      title: '佣金',
      dataIndex: 'commissionFee',
      render: (e, record) => {
        return <InputNumber
          onChange={(e) => {
            onChangeTable({
              commissionFee: e
            }, record.id)
          }} value={e}></InputNumber>
      }
    },
    {
      title: '业绩',
      dataIndex: 'performance',
      render: (e, record) => {
        return <InputNumber onChange={(e) => {
          onChangeTable({
            performance: e
          }, record.id)
        }} value={e}></InputNumber>
      }
    },
    {
      title: '业绩比例(%)',
      dataIndex: 'performancePercentage',
    },
    {
      title: '级别名称',
      dataIndex: 'levelName',
    },
    {
      title: '员工名称',
      dataIndex: 'adminName',
    },

  ];

  return (
    <TableDataBlock
      // btnExtra={btnExtra}
      // searchItems={searchItems}
      columns={getColumns}
      list={tableList}
      rowKey={(record) => `${record.id}`}
    ></TableDataBlock>
  );
};
export default connect(({ subscriber, loading }) => ({
  loading: loading.effects['order/fakeConfirmDistribute'],
}))(PointDetail);;
